<template>

  <Form ref="planInfo" :model="planInfo" :label-width="250" :rules="ruleInline" style="height:500px;">
    <FormItem label="项目状态" prop="project_state">
      <Select v-model="planInfo.project_state" style="width:400px;">
        <Option
          v-for="item in projectStateList"
          :value="item.value"
          :key="item.value"
        >{{ item.label }}
        </Option>
      </Select>
    </FormItem>
    <FormItem label="完成日期" prop="finished_date">

      <DatePicker type="date" placeholder="完成日期" style="width: 200px"
                  v-model="planInfo.finished_date"></DatePicker>
    </FormItem>


    <FormItem>
      <Button type="primary" @click="post('planInfo',planInfo)">保存</Button>
    </FormItem>
  </Form>

</template>
<script>
  import {plan} from "@/api/supervision";
  import {
    Button,
    DatePicker,
    Form,
    FormItem,
    Input,
    InputNumber,
    Modal,
    Option,
    Radio,
    RadioGroup,
    Select,
    TabPane,
    Tabs,
    Tag,
  } from "iview";
  //import {mapGetters} from "vuex";

  export default {
    components: {
      InputNumber,
      Button,
      Form,
      FormItem,
      Input,
      Tabs,
      TabPane,
      RadioGroup,
      Radio,
      Select,
      Option,
      Tag,
      Modal,
      DatePicker
    },
    data() {
      return {
        planInfo: {
          id: '',
          title: '',
        },
        ruleInline: {
          //title: [{required: true, message: "必须填写公司名称", trigger: "blur"}],
          //address: [{required: true, message: "必须填写公司地址", trigger: "blur"}],
        },
        project_id: 0,
        //必填，选项可编辑（默认选项：合同、需求、开发、到货、安装、测试、校验、培训、试运行、安全测评、第三方测评、符合性验收、专家验收）
        projectStateList: [
          {
            label: '合同',
            value: '合同'
          },
          {
            label: '需求',
            value: '需求'
          },
          {
            label: '开发',
            value: '开发'
          },
          {
            label: '到货',
            value: '到货'
          },
          {
            label: '安装',
            value: '安装'
          },
          {
            label: '测试',
            value: '测试'
          },
          {
            label: '校验',
            value: '校验'
          },
          {
            label: '培训',
            value: '培训'
          },
          {
            label: '试运行',
            value: '试运行'
          },
          {
            label: '安全测评',
            value: '安全测评'
          },
          {
            label: '符合性验收',
            value: '符合性验收'
          },
          {
            label: '专家验收',
            value: '专家验收'
          }
        ]
      };
    },
    methods: {
      post(type, data) {

        if(type === 'planInfo') {
          this.$refs["planInfo"].validate(valid => {
            if(valid) {
              data['project_id'] = this.project_id;

              if(data.id) {
                //更新数据
                plan.update(data.id, data).then(res => {
                  if(res.errno !== 0) {
                    this.$Message.error(res.errmsg);
                  } else {
                    //this.$router.push("/supervision/project/list");
                    this.$router.push({
                      path: "/supervision/plan/list",
                      query: {
                        project_id: this.project_id,
                      }
                    });
                  }
                });
              } else {
                //新增数据
                plan.create(data).then(res => {
                  if(res.errno !== 0) {
                    this.$Message.error(res.errmsg);
                  } else {
                    //this.$router.push("/supervision/project/list");
                    this.$router.push({
                      path: "/supervision/plan/list",
                      query: {
                        project_id: this.project_id,
                      }
                    });
                  }
                });
              }
            } else {
              this.$Message.error("请填写必要信息");
            }
          });
        }
      },
      get(id) {
        plan.getInfo(id, {}).then(res => {
          this.planInfo = res.data;
        });
      },
    },
    computed: {
      //...mapGetters(["getUser"])
    },
    mounted() {
      if(this.$route.query.project_id) {
        this.project_id = this.$route.query.project_id;
      }

      if(this.$route.query.id) {
        this.get(this.$route.query.id);
      }
    }
  };
</script>
